import React, { Component } from 'react';

import NetUitl from '../../utils/HttpUtil';
import TitleBar from '../../components/TitleBar';
import TeamState,{Tagone,Tagtwo} from '../../components/TeamState';
import VHChart from '../../components/VHChart';
import "./page.scss";
import mokuaiguanli from '../../static/mokuaiguanli.svg'
import xiangmu from '../../static/xiangmu.svg'

var testdate = (data,ist)=>{
    if(data){
        if(ist){
            return `${(data).toFixed(2)}`
        }
        return data
    }else{
        return 0
    }
}

class TeamPage extends Component {
    constructor(props) {
        super(props);
        this.state={
            id:8,
            tabsData:[
                    {key:1,name:"研发整体"},
                    {key:2,name:"数据与咨询事业部研发中心"},
                    {key:3,name:"软件事业部"},
                    {key:4,name:"软件事业部研发支持部"},
                    {key:5,name:"中心研发中心"},
                    {key:6,name:"供应链事业部"},
                    {key:7,name:"政府解决方案事业部"},
                    {key:8,name:"HIA运营中心"},

                ],
            date:""
        }

    }
    componentDidMount(){
        console.log(this.props.data)
    }
    componentWillReceiveProps(props){
        this.setState({
            data:this.props.data
        })
    }
    render() {
        const {data,date}=this.props;
        let obj = {dimension:[],measure:[]};
        return (
                 <div className="page1">
                    <div className="team-left">
                        <TitleBar name="团队状态"/>
                        <div className="margin-16">
                            <TeamState data={data} />
                        </div>
                        <div style={{height:'380px',marginTop:"48px",paddingLeft:'15px',paddingRight:'15px'}}>
                            <VHChart
                                title={'出勤比率一周变化'}
                                color={['#1890ff']}
                                chartType={'column'}
                                data={data && data.attendancePercentChart ? data.attendancePercentChart : obj}
                                yAxisLabelFormatter={'%'}
                                barWidth={30}
                                searchDate={date}
                            />
                        </div>
                    </div>
                    <div className="team-right">
                        <div className="model-p">
                            <TitleBar name="当日研发工作饱和指标"/>
                            <div className="flex-center-around margin-16">
                                <Tagone name="在研模块数" number={testdate(data.moduleNum)} imgs={mokuaiguanli} />
                                <Tagone name="支持项目数" number={testdate(data.supportProjectNum)} imgs={xiangmu} />
                                <Tagtwo title="新增及修改代码行数" data={[{name:"当日总量",number:testdate(data.codeNum)},{name:"2019年日均",number:"33932.6行"},{name:"当日人均",number:testdate(data.codeAvg,true)}]} />
                                <Tagtwo title="修改需求及BUG数量" data={[{name:"当日总量",number:testdate(data.updateDemandAndBugNum)
},{name:"2019年日均",number:"313.3个"},{name:"当日人均",number:testdate(data.updateDemandAndBugAvg,true)}]} />   
                            </div>
                        </div>
                        <div className="model-tag model-p">
                             <TitleBar name="研发指标一周变化"/>
                             <div style={{height:'250px',marginTop:10,paddingLeft:'15px',paddingRight:'15px'}}>
                             <VHChart
                                title={'新增及修改代码人均数'}
                                color={['#80C9C5']}
                                chartType={'column'}
                                data={data && data.codeAvgChart ? data.codeAvgChart : obj}
                                barWidth={30}
                                markLineAvgUnit={'行'}
                                showMarkLine={false}
                            />
                            </div>
                            <div style={{height:'250px',paddingLeft:'15px',paddingRight:'15px'}}>
                            <VHChart
                                title={'修改需求及BUG人均数'}
                                color={['#EA9885']}
                                chartType={'column'}
                                data={data && data.updateDemandAndBugAvgChart ? data.updateDemandAndBugAvgChart : obj}
                                barWidth={30}
                                markLineAvgUnit={'个'}
                                showMarkLine={false}
                            />
                            </div>
                        </div>
                    </div>
                     <div>
                         {!!data.remark&&<p style={{color:'red',position:'absolute',left:'16px',top:'97%'}}>注：<span>{data.remark}</span></p>}
                     </div>
                </div>
        );
    }
}

export default TeamPage;
